<template>
  <span>
    <el-input v-model="keyword" placeholder="请搜索" style="width:400px;margin-top: 20px;"></el-input>
    <el-button icon="el-icon-search" type="info" @click="search"></el-button>
  </span>
</template>

<script>
export default {
  data() {
    return {
      keyword: ""
    }
  },
  methods: {
    search() {
      if (this.$route.query.keyword !== this.keyword) {
        this.$router.push(`/search/${ this.keyword}`);

        // this.$router.push({ path: 'search', query: { keyword: this.keyword } });
        this.keyword = ''; // 清空搜索框
      }
    }

  }
}
</script>

<style scoped>
.el-button--info {
  background-color: black;
  border-color: black;
}
</style>